<template>
	<view class="transferhome">
		<view class="f15 withdraw">
			<view class="px15 py15 mt15">
				<view>
					<view class="f14 sgrey">转账币种</view>
					<view class="enternumber px15 py15 por border-radius-7 mt10">
						<picker @change="bindPickerChange" :value="coinindex" :range="coinarray">
								<view class="uni-input">{{coinarray[coinindex]}}</view>
						</picker>
					</view>
					<view class="f14 sgrey">数量</view>
					<view class="enternumber px15 py15 por border-radius-7 mt15">
						<input type="number" placeholder="输入转账数量"  v-model="transnumber" @input="check" @blur="judge()">
						<view class="poa quanbu fwb color-theme" @click="allin">全部</view>
					</view>
				</view>
				<view class="mt20">
					<view class="f14 sgrey">接收地址</view>
					<view class="enternumber px15 py15 por border-radius-7 mt15">
						<input type="text" placeholder="输入地址" v-model="address">
					</view>
				</view>
				<view class="mt20">
					<view class="f14 sgrey">备注</view>
					<view class="enternumber px15 py15 por border-radius-7 mt15">
						<input type="text" placeholder="输入备注" v-model="remark">
					</view>
				</view>
				<view class="mt20">
					<view class="f14 sgrey">手续费</view>
					<view class="enternumber px15 py15 por border-radius-7 mt15">
						12ETH
					</view>
				</view>
				<view class="transtip mt20 sgrey">
					<view class="f14">转账流程说明</view>
					<view class="fsb mt15">
						<view class="flex-1 por tiptans">
							<image src="../../static/user/dian.png" class="dian"></image>
							<view class="mt5 f12">发起转账</view>
						</view>
						<view class="flex-1 por tiptans">
							<image src="../../static/user/dian.png" class="dian"></image>
							<view class="mt5 f12">系统审核</view>
						</view>
						<view class="flex-1 por tiptans">
							<image src="../../static/user/dian.png" class="dian"></image>
							<view class="mt5 f12">链上转账</view>
						</view>
						<view class="por">
							<image src="../../static/user/dian.png" class="dian"></image>
							<view class="mt5 f12">成功/失败</view>
						</view>
					</view>
				</view>
				<view class=" withdrawtip f13 sgrey">
					提示：请仔细核对区块链钱包地址，否则将资产造成的损失 并不可找回；请务必确认手机处于安全状态，防止信息被篡 改或泄漏。
				</view>
				<view class="white flex-text f16 h44 lh1 btmbtn mb20" @click="transfer">确定转账</view>
			</view>
		</view>
		<pay :show="payShow" @close='payCloseFunc' @finish="submit" ref="payword"></pay>
	</view>
</template>

<script>
	import pay from '../../components/payPassword/pay_Password.vue'
	import { mapState, mapActions } from 'vuex';
	export default {
		data() {
			return {
				coinarray: ['USDT-ERC20', 'STD', 'ETH', 'BTC','STD-ERC20'],
				coinindex: 0,
				transnumber:'',
				snknote:0,
				availNumber:0,
				address:'',
				minNumber:1,
				remark:'',
				payShow: false,
				disabled: false,
				btnfalse:false,
			}
		},
		components: {
			pay
		},
		computed: {
			rule() {
				return [
					{ name: 'telphone', checkType: 'phone', checkRule: '', errorMsg: '请输入正确的接收用户手机号' },
					{ name: 'transfer', checkType: 'required', checkRule: '', errorMsg: '请输入转账数量' }
				]
			}
		},
		onLoad(options) {
			// this.getWithdrawMsg()
			// this.getUser()
			// navigatePage('/pages/exchange/success?type=1', 'slide-in-right')
		},
		methods:{
			bindPickerChange: function(e) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.coinindex = e.target.value
			},
			check: function(e) {
				e.target.value = (e.target.value.match(/\D/g)[0]) || null
				this.$nextTick(() => {
					this.transnumber= e.target.value
				})
			},
			async getWithdrawMsg(){
				let withparams ={
					type:this.cointype,
					moneyType:1
				}
				let headerUUid = this.randomString(Math.ceil(Math.random()*10))
				let validData =this.addQueryString(Object.assign({},withparams))
				validData+= '&secretKey=YLtwNzGIGq3EKFev'
				withparams.sign = this.$md5(validData)
				let { data } = await this.$http.post('exchange.WithdrawalParameters',withparams, {isAuth: true,isId:true,header:{phoneUuid :headerUUid},tipConfig: { isLoading: false } })
				this.availNumber = data.availableBalance
			},
			back(){
				uni.reLaunch({
					url:'/pages/exchange/index'
				})
			},
			payCloseFunc(){
				this.payShow = false
			},
			changeCoinType(ind){
				this.cointype = ind
				this.transnumber=''
				this.getWithdrawMsg()
			},
			judge(){
				if(this.transnumber<1){
					uni.showToast({
						title: '您的转账数量需要超过1个',
						icon: 'none'
					})
					return
				}
			},
			allin(){
				this.transnumber =parseFloat( Number(this.availNumber))
			},
			submit:async function(e){
				let that = this
				let param = {
					symbol:'USDT',
					type:that.cointype,
					mobile :that.otherphone,
					number:that.transnumber,
					payPwd:that.$md5(e)
				}
				let headerUUid = that.randomString(Math.ceil(Math.random()*10))
				let validData =that.addQueryString(Object.assign({},param))
				validData+= '&secretKey=YLtwNzGIGq3EKFev'
				param.sign = that.$md5(validData)
				await that.$http.post('exchange.transfer', param, {isAuth:true,isId:true, header:{phoneUuid:headerUUid}, tipConfig: { isLoading: false } }).then(data=>{
					that.navigatePage('/pages/exchange/success?type=1', 'slide-in-right')
				}).catch(err => {
					// that.otherphone = ''
					// that.transnumber = ''
					that.$refs.payword.close()
					that.payShow = false
				})
			},
			transfer(){
				uni.redirectTo({
					url:'success'
				})
				if (!this.checkRule({ transfer: this.transnumber})) return;
				if (!this.checkRule({ telphone: this.otherphone})) return;
				// if(this.userInfo.snknote<this.transnumber){
				// 	uni.showToast({
				// 		title: '您的USDT不足',
				// 		icon: 'none'
				// 	})
				// 	return
				// }
				this.payShow = true
			}
		}
	}
</script>

<style lang="less" scoped>
	.transferhome{
		.sgrey{
			color: #828282;
		}
		.dian{
			width: 28rpx;
			height: 28rpx;
		}
		.withdraw{
			.mainchain{
				width: 144rpx;
				height: 60rpx;
				text-align: center;
				line-height: 60rpx;
				font-size: 28rpx;
				border-radius: 4px;
				margin-right: 48rpx;
			}
			.usdt{
				width: 48rpx;
				height: 48rpx;
			}
		}
		.transtip{
			.tiptans::after{
				content: '';
				width: 92%;
				height: 2rpx;
				background-color: #ECECEC;
				position: absolute;
				top:14rpx;
				left: 28rpx;
			}
		}
		.withdrawtip{
			margin-top: 60rpx;
		}
		.enternumber{
			background-color: #F5F6F7;
			color: #000;
			border-radius: 8rpx;
		}
		.quanbu{
			right:30rpx;
			top:40rpx;
			color: #308AE4;
			font-size:30rpx ;
			
		}
		.btmbtn{
			margin-top:70rpx;
			background-color: #308AE4;
			border-radius: 14rpx;
		}
	}
</style>
